<template>
  <a-card :bordered="false">

    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
		  <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="申请人">
              <a-input placeholder="请输入申请人" v-model="queryParam.nannyName"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="审核状态"> 
				<a-select v-model="queryParam.status" placeholder="请选择审核状态">
				  <a-select-option :value="item.id" v-for="(item,index) in statusList" :key="index">{{item.name}}</a-select-option>
				</a-select>
            </a-form-item>
          </a-col>
		  <a-col :xl="6" :lg="7" :md="8" :sm="24">
		    <a-form-item label="预留号码">
		      <a-input placeholder="请输入预留号码" v-model="queryParam.phoneNum"></a-input>
		    </a-form-item>
		  </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>

        </a-row>
      </a-form>
    </div>
    <div>
      <!-- <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div> -->

      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        class="j-table-force-nowrap"
		 @change="handleTableChange">
        <span slot="status" slot-scope="text, record">
			{{statusList[text].name}}
		</span>
        <span slot="action" slot-scope="text, record">
         <a @click="handleChanqestatus(record,1)" v-if="record.status == 0">审核通过</a>
          <a-divider type="vertical" v-if="record.status == 0"/>
          <a @click="handleChanqestatus(record,2)" v-if="record.status == 0">审核不通过</a>
        </span>

      </a-table>
    </div>
    <!-- table区域-end -->

    <!-- 表单区域 -->
    <cashOut-modal ref="modalForm" @ok="modalFormOk"></cashOut-modal>
  </a-card>
</template>

<script>
  import '@/assets/less/TableExpand.less'
  import CashOutModal from './modules/CashOutModal'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import { getAction } from '@/api/manage'
  export default {
    name: "CashOutList",
    mixins:[JeecgListMixin],
    components: {
      CashOutModal
    },
    data () {
      return {
        description: '提现申请管理页面',
		statusList:[{
			id:0,
			name:'待审核'
		},{
			id:1,
			name:'已发放'
		},{
			id:2,
			name:'已拒绝'
		}],
        // 表头
        columns: [
          // {
          //   title: '#',
          //   dataIndex: '',
          //   key:'rowIndex',
          //   width:60,
          //   align:"center",
          //   customRender:function (t,r,index) {
          //     return parseInt(index)+1;
          //   }
          //  },
		   {
		    title: '申请人',
		    align:"center",
		    dataIndex: 'nannyName'
		   },
		   {
		    title: '银行卡号',
		    align:"center",
		    dataIndex: 'bankAccount'
		   },
		   {
		    title: '预留电话',
		    align:"center",
		    dataIndex: 'phoneNum'
		   },
		   {
            title: '创建时间',
            align:"center",
            dataIndex: 'createTime'
           },
		   {
            title: '申请金额',
            align:"center",
            dataIndex: 'applyAmount'
           },
		   {
            title: '审核状态',
            align:"center",
            dataIndex: 'status',
			scopedSlots: { customRender: 'status' },
           },
          {
            title: '操作',
            dataIndex: 'action',
            align:"center",
            scopedSlots: { customRender: 'action' },
          }
        ],
		url: {
          list: "/wechat/wechatCashOut/list",
          chanqestatus: "/wechat/wechatCashOut/changeStatus",
          deleteBatch: "/wechat/wechatCashOut/deleteBatch",
          exportXlsUrl: "wechat/wechatCashOut/exportXls",
          importExcelUrl: "wechat/wechatCashOut/importExcel",
       },
    }
  },
  computed: {
    importExcelUrl: function(){
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
    }
  },
    methods: {
		handleChanqestatus(record,status){
			const that = this
			let title = status == 1 ?'确定审核通过?':'确定审核不通过?'
			this.$confirm({
			  title:title ,
			  centered: true,
			  onOk () {
			    getAction(that.url.chanqestatus,{id:record.id,status}).then(res => {
			    	if(res.code == 200) {
						that.$message.success(status == 1 ?'审核通过':'审核不通过');
			    		that.loadData();
			    	}
			    })
			  }
			})
		}
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less';
</style>